<!--保证金充值详情-->
<template>
  <scroller class="all bg1">
    <div v-if="data" class="wrapper">
      
      <div class="head">
        <text class="font48 text2">{{'+ '+data.cancleAmount+" "+data.payType}}</text>
      </div>
      <div class="line line1"></div>

      <div class="height50"></div>
      <div class="row">
        <text class="font28 text3 widht220">{{T('充值状态')}}</text>
        <div class="widht20"></div>
        <text class="font28 text2">{{data.rechargeType}}</text>
      </div>
      <div class="height50"></div>
      <div class="row">
        <text class="font28 text3 widht220">{{T('充值类型')}}</text>
        <div class="widht20"></div>
        <text class="font28 text2">{{T('普通充值')}}</text>
      </div>
      <div class="height50"></div>
      <div class="row">
        <text class="font28 text3 widht220">{{T('充值时间')}}</text>
        <div class="widht20"></div>
        <text class="font28 text2">{{data.cancleTime}}</text>
      </div>

      <div class="height90"></div>
      <div class="row">
        <text class="font28 text3 widht220">{{T('支付币种')}}</text>
        <div class="widht20"></div>
        <text class="font28 text2">{{data.payType}}</text>
      </div>
      <div class="height50"></div>
      <div class="row">
        <text class="font28 text3 widht220">{{T('支付数量')}}</text>
        <div class="widht20"></div>
        <text class="font28 text2">{{data.payAmount}}</text>
      </div>
      <div class="height50"></div>
      <div class="row">
        <text class="font28 text3 widht220">{{T('到账数量')}}</text>
        <div class="widht20"></div>
        <text class="font28 text2">{{data.cancleAmount+" "+data.payType}}</text>
      </div>

      <div class="height90"></div>
      <div class="row">
        <text class="font28 text3 widht220">{{T('支付地址')}}</text>
        <div class="widht20"></div>
        <text class="font28 text2 all" @click="copyClick(data.fromAddress)">{{data.fromAddress}}</text>
        <LImage class="img-copy" :src="Config.img('hhr_activity_but_copy.png')" @click="copyClick(data.fromAddress)"></LImage>
      </div>

      <div class="height90"></div>
      <div class="row">
        <text class="font28 text3 widht220">{{'Txid'}}</text>
        <div class="widht20"></div>
        <text class="font28 text2 all" @click="copyClick(data.txId)">{{data.txId}}</text>
        <LImage class="img-copy" :src="Config.img('hhr_activity_but_copy.png')" @click="copyClick(data.txId)"></LImage>
      </div>


      <div class="height90"></div>
      <div class="row acenter">
      <text class="font22 text3">{{T('对此项交易有疑问，请')}}</text>
      <text class="font22 main-t1"  @click="lianxiClick">{{T('联系我们')}}</text>
      </div>
    </div>
  </scroller>
</template>

<style src="@/_css/style.css" ></style>
<style scoped>
.wrapper{
  padding-bottom: 60px;
  padding-left: 40px;
  padding-right: 40px;
}
.head {
  justify-content: center;
  height: 150px;
}
.line {
  height: 1px;
  margin-right: -40px;
}
.img-copy {
  width: 25px;
  height: 25px;
  margin-left: 10px;
}
.widht220{
  width: 220px;
}
.height90 {
  height: 90px;
}
</style>

<script>
import jnavigator from "@/_js/navigator";
import jmodal from "@/_js/modal";
import jmath from "@/_js/math";
import jconfig from "@/_js/config";
import jhttps from "@/_js/https";
import jtime from "@/_js/time";


const clipboard = weex.requireModule("clipboard");
const weexFunction = weex.requireModule("WeexFunction");

import I18N from "@/_i18n/i18n";
var T = I18N.t;
weexFunction.setTitle(T('充值详情'));

export default {
  
  data() {
    return {
      T:T,
      Config:jconfig,

      orderId:"",
      data:undefined,
    };
  },

  created() {

    var param = weex.config;
    this.orderId = param.orderId

    this.httpsInfo();
  },

  methods: {

    initData(data) {

      data.rate = jmath.chu(data.payAmount, data.cancleAmount, 6, 1);
      data.cancleTime = jtime.getTime(data.cancleTime, 'y/M/d H:m');
      data.rechargeType = data.rechargeType == 4 ? T('成功') : T('充值中');
      return data;
    },

    /********************************* HTTP*/
    //https充值详情
    httpsInfo(){
      jmodal.showLoad();
      var param = {'orderId':this.orderId};
      jhttps.post("tradeV2/rechargeDetail",param,true,(data)=>{
        jmodal.hideLoad();
        if(data.status == 200){
          var data = data.data;
          this.data = this.initData(data);
        }else{
          jmodal.toast(data.msg);
        }
      });
    },

    /********************************* 点击*/
    //复制点击
    copyClick(value){
      jmodal.toast({message:T('复制成功'), duration:2});
      clipboard.setString(value);
    },

    //联系我们
    lianxiClick(){
      var nav = {'navColor':'#0c0c0c'};
      jnavigator.open("", "mine/Contract", undefined, nav);
    },
  },
};
</script>
